<!-- 我的课程			kecheng -->
<template>
	<view class="">
		<view class="kecheng-bai  pt5" style="position: fixed;top: 0;z-index: 999;">
			<view class="kecheng-tab mt2">
				<u-subsection :list="list" :current="curNow" @change="sectionChange" active-color="#fff"></u-subsection>
			</view>
		</view>
		<view class="mt60 pb30" v-if="data != ''">
			<view class="kecheng-con mt10"  @click="godetails(item.id)" v-for="(item,index) in data" :key="index" >
				<view class="">
					<view class="w95 f b">
						<view>
							<image style="width: 232rpx;height: 156rpx;" :src="item.courseInfo.img"
								mode=""></image>
						</view>
						<view class="vw55 f d">
							<text class="fs28 bold ellipsis" :class="{'sijiao': item.type==2}">{{item.courseInfo.name}}</text>
							<text class="fs22 hui p_t_10 ellipsis-2 ">{{item.courseInfo.title}}</text>
							<view class="f b p_t_20">
								<view class="">
									<text class="hui fs24" v-if="item.is_study == 0">未学习</text>
									<text class="hui fs24" v-if="item.is_study == 1">已学习</text>
									<text class="hui fs24" v-if="item.is_study == 2">已评价</text>
								</view>
								<view class="information-buts"  @click.stop="course(item.id)" v-if="item.is_study == 1">
									<button type="default" :class="{'bg_sijiao': item.type==2}">课程评价</button>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="dis-flex flex-align-center flex-center  wd100" style="height: 1000rpx;" v-else>
			<u-empty text="暂无课程" mode="list"></u-empty>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						name: '全部'
					},
					{
						name: '未学'
					},
					{
						name: '已学'
					}
				],
				curNow: 0,
				data:[]
			}
		},
		onLoad() {
			// 动态导航条文字
			uni.setNavigationBarTitle({
				title: '我的课程'
			})
			
		},
		onShow() {
			this.init()
		},
		methods: {
			init(){
				var that = this
				var json = {
					tag:that.curNow
				}
				that.$http.post(that.$config.UrlPostusercourseList, json).then((res) => {
					if (res.status == 1) {
						that.data = res.data
					}
				})
			},
			sectionChange(index) {
				this.curNow = index;
				this.init()
			},
			course(id){
				uni.navigateTo({
					url:'../evaluate/evaluate?id='+id
				})
			}
		}
	}
</script>

<style>
	.warps {
		height: 100vh;
		overflow: hidden;
		background-color: #F6F8FC;
	}

	.kecheng-bai {
		width: 750rpx;
		height: 100rpx;
		opacity: 1;
		background: #ffffff;
		border-radius: 0rpx 0rpx 16rpx 16rpx;
		box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(0, 0, 0, 0.16);
	}

	.kecheng-tab {
		width: 490rpx;
		height: 52rpx;
		opacity: 1;
		background: #f1f6ff;
		border-radius: 26rpx;
		margin-left: 32rpx;
	}

	.kecheng-con {
		width:710rpx;
		height: 204rpx;
		opacity: 1;
		background: #ffffff;
		border-radius: 8rpx;
		box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(0, 0, 0, 0.16);
		margin: 0 auto;
		margin-top: 32rpx;
		overflow:hidden;
	}
	.information-buts>button{
		width: 170rpx;
		height:46rpx;
		line-height:46rpx;
		font-size: 26rpx;
		opacity: 1;
		background: #1f73f2;
		border-radius:200rpx;
		color: #fff;
	}
	.sijiao{
		color:#FF8C23!important;
	}
	.bg_sijiao{
		background-color:#FF8C23!important;
	}
</style>
